﻿
*:focus
{
    outline: none; /* Prevents blue border in Webkit */
}

input.text,textarea
{
    font-family: "Helvetica Neue" , Helvetica, Arial, sans-serif;
    background-color: #fff;
    border: 1px solid #ccc;
    font-size: 20px;
    width: 300px;
    min-height: 30px;
    display: block;
    margin-bottom: 16px;
    margin-top: 8px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.summary-textarea
{
    font-family: "Helvetica Neue" , Helvetica, Arial, sans-serif;
    background-color: #fff;
    border: 1px solid #ccc;
    font-size: 20px;
    display: block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    height:118px;
    width:683px;
}
input.text:focus, textarea:focus
{
    -webkit-box-shadow: 0 0 25px #ccc;
    -moz-box-shadow: 0 0 25px #ccc;
    box-shadow: 0 0 25px #ccc;
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
}


input.text:not(:focus), textarea:not(:focus)
{
    opacity: 0.5;
}

input.text:required, textarea:required
{
    background: url("../Images/asterisk_orange.png") no-repeat 280px 7px;
}

input.text:valid, textarea:valid
{
    background: url("../Images/tick.png") no-repeat 280px 5px;
}

input.text:invalid, textarea:focus:invalid
{
    background: url("../Images/cancel.png") no-repeat 280px 7px;
}
